<template>
	<el-container>
		<el-header>申请退药 </el-header>
		<div style="width: 100%">
			<el-table :data="tableData" style="width: 100%">
				<el-table-column prop="id" label="订单号" width="105">
				</el-table-column>
				<el-table-column prop="name" label="药品名称" width="200">
				</el-table-column>
				<el-table-column prop="cost" label="单价(￥)" width="150">
				</el-table-column>
				<el-table-column prop="number" label="数量" width="175">
				</el-table-column>
				<el-table-column prop="doctorname" label="开立医生" width="175">
				</el-table-column>
				<el-table-column prop="prescriptid" label="处方单号" width="175">
				</el-table-column>
				<el-table-column prop="time" label="开立时间" width="175">
				</el-table-column>
				<el-table-column type="selection" width="25">
				</el-table-column>
				<el-table-column label="全选" width="50" fixed="right">
				</el-table-column>
			</el-table>
			<el-pagination background layout="prev, pager, next" :total="1000">
			</el-pagination>
		</div>
		<el-footer>
			<el-row :gutter="20">
				<el-col :span="18">
					<div style="color: #4fc1b0;">0</div>
				</el-col>
				<el-col :span="4">
					<div class="grid-content bg-purple1">
						<el-button style="width:100px;" @click="open">提交申请</el-button>
					</div>
				</el-col>
			</el-row>
		</el-footer>
	</el-container>
</template>

<script>
	import {
		showMsgTitle
	} from '@/utils/api'
	import {
		showMsgConfirm
	} from '@/utils/api'
	import {
		getRequest
	} from '@/utils/api'

	export default {
		data() {
			return {
				tableData: [{}],
				checkList: ['选中且禁用', '复选框 A']
			}
		},
		mounted: function() {
			let url = "/patient/drug";
			let _this = this;
			getRequest(url).then(resp => {
				if (resp.status == 200) {
					//alert(resp.data);
					_this.tableData = resp.data;
				} else {
					_this.$message({
						type: 'error',
						message: '数据加载失败!'
					});
				}
			}, resp => {
				_this.loading = false;
				if (resp.response.status == 403) {
					_this.$message({
						type: 'error',
						message: resp.response.data
					});
				} else {
					_this.$message({
						type: 'error',
						message: '数据加载失败!'
					});
				}
			}).catch(resp => {
				//压根没见到服务器
				_this.loading = false;
				_this.$message({
					type: 'error',
					message: '数据加载失败!'
				});
			});
		},
		methods: {
			handleEdit(index, row) {
				console.log(index, row);
			},
			handleDelete(index, row) {
				console.log(index, row);
			},
			open() {
				this.$alert('申请成功！', '提示', {
					confirmButtonText: '确定',
					callback: action => {
						this.$message({
							type: 'info',
							message: `action: ${ action }`
						});
					}
				});
			}
		}
	}
</script>

<style>
	.el-header,
	.el-footer {
		background-color: #4fc1b0;
		color: #ffffff;
		text-align: left;
		line-height: 60px;
		font-size: 50px;
	}
</style>
